<!doctype  html>
<html>
<head>  <meta   charset="utf-8"/>
<title>表 华容道  格</title>
</head>
<style>
  table{float:left;}
  .clearfix:after{content: "";display: block;clear: both}
  .clearfix{zoom:1;}
  p,span,b,ul,li,dt,dd{padding:0;margin:0;}
  .cash{margin:0 auto;
    width: 350px;
    height: 41px;
    /*background-color: lime;*/
    font-size: 12px;
    color: #8f8f8f;
  }
  .cash a{
    text-decoration: none;
    font-size: 14px;line-height: 41px;text-align: center;
    color: #8f8f8f;
    display: block;float: left;
    width: 109px;
    height: 41px;
    background-color: #eaeaea;
    border-radius: 10px
  }
  .cash .right {
    width: 185px;height: 41px;float: left;margin-left: 27px;/*background-color:SteelBlue;*/
  }
  .right .p1{margin-top: 2px;margin-bottom: 9px;font-size: 12px}
  .right .p2{background:url(img/wen.png) 2px center no-repeat ;padding-left: 23px;}
  .hua{margin:0 auto;margin-top: 50px;
    width: 750px;
    height: 200px;color: #585656;
    background-color: aqua;
    }
    .hua p{
      width: 530px;height: 40px;margin-left: 15px; background-color:SteelBlue;font-size: 14px;padding-top: 160px
    }
    .hua span{display: inline-block;vertical-align:middle}
    .hua b{display: inline-block;vertical-align:middle;font-size: 16px;color: #e01135 ;
      margin-left: 38px;margin-right: 26px;font-size: 16px}
    .hua .span{float: right;font-size: 12px}
    .hua strong{font-size: 14px;color: #e01135}
  .yun{margin:0 auto;width: 720px;height: 40px;/*margin-left: 22px;*/ /*background-color:chartreuse;*/font-size: 14px;color: #585656;}
   ul li{list-style: none;float: left;height: 40px;font-size: 14px}
  .spirit{width: 228px}
 .spirit .lerovole{margin-bottom: 8px}
 .price{width: 90px;color: #e01135;line-height: 36px;font-size: 16px}
 .complaint{width: 133px;line-height: 36px}
 .freight{width: 183px}
 .freight-top{color: #e01135;margin-left: 20px;margin-bottom: 6px}
 .freight-bottom{font-size: 12px}
 .confirm input{border:none;width: 86px;height: 30px;border-radius: 5px;line-height: 30px;text-align: center;color: white;background-color: #76a8fc;margin-top: 3px}

 .service-centre{width: 300px;height: 500px;padding-left: 0;background-color: #76a8fc;}
 /*.service-center*/.service-centre a{display: block;width: 100px;height: 50px}
.service-centre a:link{background-color:green ;text-decoration: overline;color: gold}
.service-centre  a:visited{background-color: #EE82EE;text-decoration:underline;font-size: 40px}
.service-centre a:hover,a:active{background-color: #3CB371;text-decoration: line-through;color: #FFFACD;font-size: 30px}
/*h3  a:link {color: #FF0000}
h3  a:visited {color: #00FF00}
h3  a:hover {color: #FF00FF}
h3  a:active {color: #0000FF}*/

 dt{padding-top: 20px}
 dd{margin-top: 14px}
input{padding:0;margin:0;}
input[type="text"]{outline: none;border:none;}
.information{font-size: 14px;}
/*.information input[type="text"]{border:none;}*/
.information input.name{width:320px;height: 27px;border-bottom: 2px solid #cecece; }
.information input.phones,input.mail{margin-left: 110px}
.information input.message{margin-top: 79px;width: 1200px;height: 27px;border-bottom: 2px solid #cecece;}



</style>
<body>
<!-- <table  border="10"  width="600px"   height="500px"   cellpadding="20"   cellspacing="0"  class="clearfix"   >
   <tr>
      <td rowspan="2"   >张</td>
      <td rowspan="2"   >赵</td>
      <td rowspan="2"   >黄</td>
      <td rowspan="2"   >马</td>
 </tr> 

<tr></tr>

<tr>
    <td></td>
    <td colspan="2" align="center" >关</td>
</tr>
 
 <tr>
     <td>兵</td>
     <td rowspan="2"  colspan="2" align="center" >曹</td>
     <td>卒</td>
</tr>

<tr>
    <td>勇</td>
    <td>士</td>
</tr> -->



<!-- </table> -->
<a href="http://www.sina.com" target="_blank"  title=新浪主页     >新浪</a>
<div class="cash">
  <!-- <div class="left"> -->
    <a href="#">提取现金></a>
 <!--  </div> -->
  <div class="right">
    <p class="p1">余额可以用来兑换现金，积分不能</p>
    <p class="p2">兑换现金，支持支付宝提现</p>
  </div>
</div>

<div class="hua clearfix">  
  <p class="fen">
    <span class="lerovole">lerovole意大利原瓶进口红酒<br/>干红葡萄酒餐酒整箱送酒杯</span>
    <b>389.00</b>
    <span class="">退货/投诉卖家</span>
    <span class="span"><strong>&nbsp;  389.00</strong><br/>(含运费：0.00)</span>
  </p>
  
</div>
<div class="yun">
      <ul>
        <li class="spirit">
          <p class="lerovole">lerovole意大利原瓶进口红酒</p>
          <p>干红葡萄酒餐酒整箱送酒杯</p>
        </li>
        <li class="price"><b>389.00</b></li>
        <li class="complaint">退货/投诉卖家</li>
        <li class="freight">
          <p class="freight-top">389.00</p>
          <p class="freight-bottom">(含运费：0.00)</p>
        </li>
        <li class="confirm"><input type="button" value="确认收货"></li>
      </ul>
  </div>  1（）2()3
  <div class="service-centre">
    <dl>
      <dt>服务中心</dt>
      <dd><a href="#">我的订单</a></dd>
      <dd><a href="#">购买过的微店</a></dd>
      <dd><a href="#">我的收藏</a></dd>
      <dd><a href="#">评价管理</a></dd>
      <dd><a href="#">退款维权</a></dd>
    </dl>
    <a href="#">火箭火箭</a>
  </div>
  <h3><a href="#">华容道</a></h3>
  <div class="information">
      <input type="text" value="姓名：" class="name">
      <input type="text" value="电话：" class="name phones">
      <input type="text" value="邮箱：" class="name mail"><br/>
      <input type="text" value="留言：" class="message">

  </div>
  
</body>
</html>